<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8"/>
        <title>000</title>
        <style>
            .box {
                width:300px;
                height:300px;
                border:1px solid #ccc;
                background-image:-webkit-radial-gradient(100px 50px,red 20px,yellow 200px);
                <!--
                    background-image:-webkit-radial-gradient(left,red 20px,yellow 200px);第一个参数可以是方向词
                    background-image:-webkit-radial-gradient(left,circle,red 20px,yellow 200px);第二个参数可选，只有两个参数circle(圆形)或者ellipse(椭圆)
                -->
            }
        </style>
    </head>
    <body>
        <div class="box"></div>
    </body>
</html>